﻿<div class="row" ng-controller="PackDetailController">
    <div class="col-lg-12 col-sm-12 col-xs-12">
        <div class="widget flat radius-bordered">
            <div class="widget-header bg-themeprimary">
                <span class="widget-caption">Pack Detail</span>
            </div>
            <div class="widget-body">
                <div class="widget-main">
                    <div class="row">
                        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
                            <div class="databox radius-bordered databox-shadowed databox-graded">
                                <div class="databox-left databox-icon bg-azure">
                                    <i class="fa fa-cube"></i>
                                </div>
                                <div class="databox-right bg-white bordered bordered-platinum">
                                    <span class="databox-number orange">ID Pack</span>
                                    <div class="databox-text darkgray text-uppercase">{{Pack.Id}}</div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
                            <div class="databox radius-bordered databox-shadowed databox-graded">
                                <div class="databox-left databox-icon bg-azure">
                                    <i class="fa fa-shopping-cart"></i>
                                </div>
                                <div class="databox-right bg-white bordered bordered-platinum">
                                    <span class="databox-number orange">Buy Date</span>
                                    <div class="databox-text darkgray text-uppercase">{{Pack.BuyDate}}</div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
                            <div class="databox radius-bordered databox-shadowed databox-graded">
                                <div class="databox-left databox-icon bg-azure">
                                    <i class="fa fa-money"></i>
                                </div>
                                <div class="databox-right bg-white bordered bordered-platinum">
                                    <span class="databox-number orange">Price</span>
                                    <div class="databox-text darkgray text-uppercase"><i class="fa fa-bitcoin"></i>{{Pack.Price|number:8}}</div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
                            <div class="databox radius-bordered databox-shadowed databox-graded">
                                <div class="databox-left databox-icon bg-azure">
                                    <i class="fa fa-bar-chart-o"></i>
                                </div>
                                <div class="databox-right bg-white bordered bordered-platinum">
                                    <span class="databox-number orange">Profit</span>
                                    <div class="databox-text darkgray text-uppercase"><i class="fa fa-bitcoin"></i>{{Pack.Profit|number:8}}</div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
                            <div class="databox radius-bordered databox-shadowed databox-graded">
                                <div class="databox-left databox-icon bg-azure">
                                    <i class="fa fa-bar-chart-o"></i>
                                </div>
                                <div class="databox-right bg-white bordered bordered-platinum">
                                    <span class="databox-number orange">Remain</span>
                                    <div class="databox-text darkgray text-uppercase"><i class="fa fa-bitcoin"></i>{{Pack.Remain|number:8}}</div>
                                </div>
                            </div>
                        </div>                       
                    </div>
                    <table class="table table-bordered table-striped table-condensed flip-content">
                        <thead class="flip-content">
                            <tr>
                                <th width="12%">Date</th>
                                <th>Profit</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr ng-repeat="data in Pack.History" ng-if="Pack.History.length != 0">
                                <td>{{data.Date}}</td>
                                <td><i class="fa fa-bitcoin"></i>{{data.Profit|number:8}}</td>                                               
                            </tr>
                            <tr ng-repeat="item in runings" ng-if="Pack.History.length == 0">
                                <td scope="2">Not Data</td>
                            </tr>
                        </tbody>
                    </table>                     
                </div>
            </div>
        </div>
    </div>
</div>        